<template>
	<view class="gt-admin-temp">
		<gt-admin-nav v-model="template"></gt-admin-nav>
		<gt-admin-list v-model="template"></gt-admin-list>
		<uni-popup ref="test" type="right">
			<view style="width: 80vw;height:100vh;" class="col bg-fff">
				<gt-tab v-model="tabIndex" :list="tabList"></gt-tab>
				<gt-admin-list v-if="tabIndex==0" v-model="template"></gt-admin-list>
				<gt-admin-list v-else-if="tabIndex==1" v-model="template2"></gt-admin-list>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tabIndex:0,
				tabList:[
					{label:'TAB1'},
					{label:'TAB2'},
					{label:'TAB3'},
				],
				template: {
					nav: [
						{ label: '账号管理' },
						{ label: '账号列表' },
					],
					selectListUrl: {},
					selectList: {
						sex: [
							{ key: 0, val: '男' },
							{ key: 1, val: '女' }
						],
						status: [
							{ key: 1, val: '未停用' },
							{ key: 0, val: '已停用' },
						],
					},
					search: {
						// 顶部搜索
						items: [
							{ placeholder: '用户名', field: 'account', },
							{ placeholder: '性别', field: 'sex', type: 'select' },
							{ placeholder: '创建时间', field: 'create_time', type: 'select-date' },
							{ placeholder: '修改时间', field: 'create_time1', type: 'select-date' },
							{ type: 'submit', label: '搜索', },
							{
								type: 'popup',
								label: '新建',
								class: 'btn btn-sm btn-default ml-15',
								url: '/api_s/admin',
								popup: {
									title: '新建后台用户',
									form: 'editor'
								},
							},
							{
								type: 'btn',
								label: '点击按钮',
								class: 'btn btn-sm btn-danger ml-15',
								click(item,data,_this){
									console.log(item,data,_this);
									_this.$fun.showMsg('我是点击按钮')
								}
							}
						]
					},
					table: {
						// 获取表格数据
						listUrl: '/api_s/admin',
						// batchSelect: true,
						columns: [
							{ label: "编号", field: "id", },
							{ label: "用户名", field: "account", },
							{ label: "头像", field: "avatar", type: 'img' },
							{ label: "角色", field: "role_id" },
							{ label: "枚举", field: "sex", type: 'select', },
							{ label: "点击复制", field: "account", type: 'copy_text' },
							{
								label: "自定义点击事件",
								field: "id",
								click(row, index, _this) {
									console.log(row, index, _this)
									_this.$refs.test.open();
								}
							},
							{
								label: "自定义颜色 & 枚举",
								field: "sex",
								type: 'select',
								color: {
									0: { color: 'green' },
									1: { color: 'orange' }
								}
							},
							{
								label: "自定义图标与颜色 & 枚举",
								field: "status",
								type: 'select',
								color: {
									0: { color: 'green', icon: 'medal-filled' },
									1: { color: 'orange', icon: 'medal-filled' }
								},
								click(row, index, _this) {
									console.log(row, index, _this)
									_this.$refs.test.open();
								}
							},
							{
								label: "自定义HTML",
								field: "name",
								type: 'custom-html',
								value(row, rowIndex, _this) {
									let str = '';
									for (let i = 0; i < rowIndex; i++) {
										str += '★';
									}
									return `<div class="c-success">` + str + `</div>`;

								}
							},
							{
								// 列表里面的操作按钮
								type: 'handle',
								field: "id",
								label: "操作",
								// 修改操作
								items: [{
										type: 'popup',
										label: '修改',
										url: '/api_s/admin',
										urlParams: ['id'],
										requestType: 'PUT',
										popup: {
											title: '修改',
											form: 'editor'
										}
									},
									// 删除操作
									{
										type: 'urlPost',
										label: '删除',
										field: 'id',
										url: '/api_s/admin',
										urlParams: ['id'],
										requestType: 'DELETE',
										isShow(row) {
											if (row.status === 0) return true;
											return false;
										}
									},
									{
										type: 'urlPost',
										label: '恢复',
										field: 'id',
										url: '/sys/sys-dict/recover',
										urlParams: ['id'],
										isShow(row) {
											if (row.status === 1) return true;
											return false;
										}
									}
								]
							}
						]
					},
					form: {
						editor: {
							class: 'gt-form-border gt-form-column gt-form-label-sm gt-form-label-right',
							style: 'width:375px;',
							items: [
								{ label: "头像", field: "avatar", },
								{ label: "角色", field: "role_id" },
								{ label: "用户名", field: "account", },
								{ label: "名称", field: "name", },
								{ label: "性别", field: "sex", type: 'select', },
								{ label: "手机号", field: "mobile" },
								{ label: "邮箱", field: "email" },
								{ label: "排序", field: "sort" },
								{ label: "图片", field: "img", type: 'upload',fileType:'video' },
								{ type: 'submit', label: '提交', class: 'btn btn-block mt-15', }
							]
						}
					}
				},
				template2: {
					nav: [
						{ label: '账号管理' },
						{ label: '账号列表' },
					],
					buttonGroup: {
						// 添加的
						items: [{
							type: 'popup',
							label: '新建',
							class: 'btn btn-xs mr-15',
							url: '/api_s/admin',
							popup: {
								title: '新建后台用户',
								form: 'editor'
							},
						}, ]
					},
					selectListUrl: {},
					selectList: {
						sex: [
							{ key: 0, val: '男' },
							{ key: 1, val: '女' }
						],
						status: [
							{ key: 1, val: '未停用' },
							{ key: 0, val: '已停用' },
						],
					},
					search: {
						// 顶部搜索
						items: [
							{ placeholder: '用户名', field: 'account', },
							{ placeholder: '性别', field: 'sex', type: 'select' },
							{ placeholder: '创建时间', field: 'create_time', type: 'select-date' },
							{ placeholder: '修改时间', field: 'create_time1', type: 'select-date' },
							{ type: 'submit', label: '搜索', }
						]
					},
					table: {
						// 获取表格数据
						listUrl: '/api_s/admin',
						// batchSelect: true,
						columns: [
							{ label: "编号", field: "id", },
							{ label: "用户名", field: "account", },
							{ label: "头像", field: "avatar", type: 'img' },
							{ label: "角色", field: "role_id" },
							{ label: "枚举", field: "sex", type: 'select', },
							{ label: "点击复制", field: "account", type: 'copy_text' },
							{
								label: "自定义点击事件",
								field: "id",
								click(row, index, _this) {
									console.log(row, index, _this)
									_this.$refs.test.open();
								}
							},
							{
								label: "自定义颜色 & 枚举",
								field: "sex",
								type: 'select',
								color: {
									0: { color: 'green' },
									1: { color: 'orange' }
								}
							},
							{
								label: "自定义图标与颜色 & 枚举",
								field: "status",
								type: 'select',
								color: {
									0: { color: 'green', icon: 'medal-filled' },
									1: { color: 'orange', icon: 'medal-filled' }
								},
								click(row, index, _this) {
									console.log(row, index, _this)
									_this.$refs.test.open();
								}
							},
							{
								label: "自定义HTML",
								field: "name",
								type: 'custom-html',
								value(row, rowIndex, _this) {
									let str = '';
									for (let i = 0; i < rowIndex; i++) {
										str += '★';
									}
									return `<div class="c-success">` + str + `</div>`;

								}
							},
							{
								// 列表里面的操作按钮
								type: 'handle',
								field: "id",
								label: "操作",
								// 修改操作
								items: [{
										type: 'popup',
										label: '修改',
										url: '/api_s/admin',
										urlParams: ['id'],
										requestType: 'PUT',
										popup: {
											title: '修改',
											form: 'editor'
										}
									},
									// 删除操作
									{
										type: 'urlPost',
										label: '删除',
										field: 'id',
										url: '/api_s/admin',
										urlParams: ['id'],
										requestType: 'DELETE',
										isShow(row) {
											if (row.status === 0) return true;
											return false;
										}
									},
									{
										type: 'urlPost',
										label: '恢复',
										field: 'id',
										url: '/sys/sys-dict/recover',
										urlParams: ['id'],
										isShow(row) {
											if (row.status === 1) return true;
											return false;
										}
									}
								]
							}
						]
					},
					form: {
						editor: {
							class: 'gt-form-border gt-form-column gt-form-label-sm gt-form-label-right',
							style: 'width:375px;',
							items: [
								{ label: "头像", field: "avatar", },
								{ label: "角色", field: "role_id" },
								{ label: "用户名", field: "account", },
								{ label: "名称", field: "name", },
								{ label: "性别", field: "sex", type: 'select', },
								{ label: "手机号", field: "mobile" },
								{ label: "邮箱", field: "email" },
								{ label: "排序", field: "sort" },
								{ label: "状态", field: "status", type: 'select', },
								{ label: "状态", field: "status", type: 'select', },
								{ label: "状态", field: "status", type: 'select', },
								{ type: 'submit', label: '提交', class: 'btn btn-block mt-15', }
							]
						}
					}
				},

			}
		},
		watch: {},
		onLoad() {},
		computed: {},
		methods: {}
	}
</script>

<style>


</style>